<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>报表显示</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="author" content="Cheresting" />
    <script src="./publicJs/vue2/vue.js"></script>
    <script src="./publicJs/vue2/form-create.min.js"></script>

    <!-- 自动添加 axios 到全局 -->
    <script src="./publicJs/axios.min.js"></script>

    <link rel="stylesheet" href="./publicJs/vue2/index.css" />
    <script src="./publicJs/vue2/index.js"></script>
  </head>

  <body>
    <div id="app">
      <form-create v-model="fapi" :rule="rule" :option="option" @submit="onSubmit"></form-create>
    </div>
  </body>
  <script type="module">
    import myAxios from './myAxios/myAxios.js'
    // import { showWarning } from './hooks/useMyMessageBox.js'
    // import useMyXlsx from './hooks/useMyXlsx.js'
    import v4 from './publicJs/uuidv4.js'

    // Vue.use(FcDesigner)
    new Vue({
      el: '#app',
      data: () => {
        return {
          fapi: null,
          rule: [],
          option: {},
        }
      },
      created: function () {
        // let route = useRoute()
        const searchParams = new URLSearchParams(window.location.search)

        let id = searchParams.get('id')
        // let id = route.query.id
        myAxios.get('陈帅廷获取报表数据', `${id}`, '9911').then((res) => {
          console.log('res :>> ', res)
          let DESIGNERRULE = res[0].DESIGNERRULE.replace(/medium/g, 'large')
          DESIGNERRULE = DESIGNERRULE.replace(/small/g, 'default')
          DESIGNERRULE = DESIGNERRULE.replace(/mini/g, 'small')
          this.rule = JSON.parse(DESIGNERRULE)

          let DESIGNEROPTIONS = res[0].DESIGNEROPTIONS.replace(/medium/g, 'large')
          DESIGNEROPTIONS = DESIGNEROPTIONS.replace(/small/g, 'default')
          DESIGNEROPTIONS = DESIGNEROPTIONS.replace(/mini/g, 'small')
          this.option = JSON.parse(DESIGNEROPTIONS)
        })
      },
      methods: {
        onSubmit(formData) {
          //todo 提交表单
        },
      },
    })
  </script>
</html>
<style>
  .marginTop10 {
    margin-top: 10px;
  }
</style>
